<template>
  <div class="app">
    <Nuxt/>
    <van-tabbar>
      <van-tabbar-item>
        <template #icon>
          <img src="~/assets/tel.png"/>
        </template>
        在线客服
      </van-tabbar-item>
      <van-tabbar-item>
        <template #icon>
          <img src="~/assets/phone.png"/>
        </template>
        免费热线
      </van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<style lang="less">
  * {
    margin: 0;
    padding: 0;
  }

  html, body, #__nuxt, #__layout {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .app {
    height: 100%;
    padding-bottom: 60px;
    padding-top: 46px;
    box-sizing: border-box;
    overflow: auto;
    -webkit-overflow-scrolling: touch;

    .van-nav-bar--fixed {
      z-index: 10;
    }

    .van-tabbar {
      box-shadow: 0px 5px 27px 0px rgba(14, 5, 10, 0.22);
      height: 65px;

      .van-tabbar-item__text {
        font-size: 18px;
        font-weight: 500;
        color: #000000;
        margin-left: 17px;
      }

      .van-tabbar-item {
        flex-direction: row;
      }

      .van-tabbar-item:nth-of-type(2) {
        border-left: 1px solid #DCDCDC;
      }
    }
  }
</style>
